<template>
    <div class="app-container">
        <el-row :gutter="20">
            <el-col :span="6" >
                <div class="grid-content bg-purple" @click="impactAnalysis">
                   <img src="" alt="" class="imgStyle"> 
                   <p>影响分析</p>
                </div>
            </el-col>
            <el-col :span="6">
                <div class="grid-content bg-purple">
                    <img src="" alt="" class="imgStyle"  @click="impactAnalysis"> 
                   <p>拓扑分析</p>
                </div>
            </el-col>
            <el-col :span="6">
                <div class="grid-content bg-purple" @click="myAnalysis">
                    <img src="" alt="" class="imgStyle"> 
                   <p>我的分析</p>
                </div>
            </el-col>
          
        </el-row>
    </div>
</template>
<script>
export default {
    name: "generalization",
    components: {

    },
    data() {
        return {

        };
    },
    mounted() {

    },
    methods: {
        //影响分析
        impactAnalysis(){
            this.$router.push({
        path: "/Metadata/impactAnalysis",
        // query: { id: "1", name: "元数据", status: "2" },
      });
        },
        //拓扑分析

        //我的分析
        myAnalysis(){
            this.$router.push({
        path: "/Metadata/myAnalysis",
        // query: { id: "1", name: "元数据", status: "2" },
      });
        }
    }
};
</script>
<style lang="scss" scoped>
@import "~@/assets/styles/mixin.scss";
@import "~@/assets/styles/variables.scss";
@import "~@/assets/styles/CommonStyle.scss";
.el-row {
 padding: 30px 40px;
    &:last-child {
      margin-bottom: 0;
    }
  }
  .el-col {
    border-radius: 4px;
   
  }
   .bg-purple-dark {
  
    background: #99a9bf;
  }
  .bg-purple {
    height: 200px;
    background: #d3dce6;
    text-align: center;
    .imgStyle{
        height: 100px;
        width: 100px;
        margin-bottom: 30px;
        margin-top:20px ;
    }
    p{
        height: 50px;
        line-height: 50px;
        border-top: 1px solid #ccc;
    }
  }
  .bg-purple-light {
    background: #e5e9f2;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }
</style>